<%@ page contentType="text/html;charset=UTF-8" %>
    <%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<html>
<head>
<meta name="decorator" content="common" />
<script src="http://pv.sohu.com/cityjson?ie=utf-8"></script> 
<style>
#showsum img{
	height:100%;
}
</style>
<script>
	$(function(){
	    var swiper = new Swiper('.swiper-container', {
	        pagination: '.swiper-pagination',
	        paginationClickable: true,
	        autoplay:3000
	    });
	})
	
	
	$(document).ready(function(){
		var imgLength=	$('#showbox').find('img').length;
		var showproduct = {
		  "boxid":"showbox",
		  "sumid":"showsum",
		  "boxw":428,//宽度,该版本中请把宽高填写成一样
		  "boxh":428,//高度,该版本中请把宽高填写成一样
		  "sumw":74,//列表每个宽度,该版本中请把宽高填写成一样
		  "sumh":74,//列表每个高度,该版本中请把宽高填写成一样
		  "sumi":14,//列表间隔
		  "sums":imgLength,//列表显示个数
		  "sumsel":"sel",
		  "sumborder":0,//列表边框，没有边框填写0，边框在css中修改
		  "lastid":"showlast",
		  "nextid":"shownext"
		  };//参数定义	  
	 $.ljsGlasses.pcGlasses(showproduct);//方法调用，务必在加载完后执行
  });
	function detailFunc(goodsComboId,goodsCode,storeCode) {
		window.location.href = "${ctxWeb}/goodsComb/goodsComboToList?goodsComboId="+goodsComboId+"&goodsCode=" + goodsCode+"&storeCode="+storeCode+"&useIp="+returnCitySN["cip"];
	}
    </script>
</head>
<body>
<!--手机端商品详情-->
	<div class="phone_detail_goods">
	<!--banner-->
	<div class="banner_rel ph_banner">
		<div class="swiper-container">
	        <div class="swiper-wrapper">
	        	<c:forEach items="${webGoodsCombDetails }" var="goodsCombDetail" varStatus="index">
					 <div class="swiper-slide">
	            	<a href="javascript:void(0)">
	            		<img src="${ctxWeb}/web/file/getFile?filePath=${goodsCombDetail.goodsImage }" alt="" />
	            	</a>
	            </div>
			  	</c:forEach>
	        </div>
	        <div class="swiper-pagination"></div>
	  	</div>	
	</div>	
	<div class="phone_msg_box">
		<figure class="item1">
			<h4>${WebGoodsComb.name }</h4>
			<c:forEach items="${webGoodsCombDetails }" var="webGoodsCombDetail">
			<p class="msg_price" onclick="detailFunc('${webGoodsCombDetail.goodsCombId}','${webGoodsCombDetail.goodsCode}','${firstStore.code}')">
				<b>配件编号：</b>
				<span>${webGoodsCombDetail.partsCode }</span>
				<b>商品名称：</b>
				<span>${webGoodsCombDetail.goodsName } x${webGoodsCombDetail.num }</span>
			</p>
			</c:forEach>
			<p><b>售价：</b><span  class="phone_price">¥${WebGoodsComb.price }</span></p>
			<!-- <p class="phone_member"><b>会员价：</b><span>会员可见</span></p> -->
		</figure>
		<%-- <figure class="item2">
			<!-- <p><b>制造商：</b><span>Mopar</span></p> -->
			<p><b>门店  ：</b><span>${webStore.cnName }</span></p>
			<p><b>区域  ：</b><span>${webStore.classifyName }</span></p>
		</figure> --%>
	</div>
	<!--banner结束-->	
	</div>
	<!--手机端商品详情结束-->
	<!--pc商品详情-->
	<div class="goods_detail_box">
		<div class="container">
			<div class="row">
				<div class="detail_box  clearfix">
					<!--左边-->
					<div class="detail_left">
						<div id="showbox">
						  <c:forEach items="${webGoodsCombDetails }" var="goodsCombDetail" varStatus="index">
							  <c:if test="${index.index<4}">
								  <c:if test="${not empty goodsCombDetail.goodsImageList}">
									<c:forEach items="${goodsCombDetail.goodsImageList}" var="imgList">		
									  	<img src="${ctxWeb}/web/file/getFile?filePath=${imgList}" width="418" height="418">
									</c:forEach>
								  </c:if>
							  </c:if>
						  </c:forEach>
						</div><!--展示图片盒子-->
						<div id="showsum" style='margin-left: -39px;'></div><!--展示图片里边-->
					</div>
					<!--左边结束-->
					<!--右边开始-->
					<div class="detail_right">
						<div class="msg_info">
							<p class="msg_title noWrapEllipsis">${WebGoodsComb.name }</p>
						</div>
						<c:choose>
						<c:when test="${WebGoodsComb.status==1}">
							<div class="package-price">
								<p class="price-new"><em>套餐价</em><span>¥${WebGoodsComb.price }</span></p>
								<p class="price-old"><em>原价</em><span>¥${WebGoodsComb.oldPrice }</span></p>
							</div>
						</c:when>
						<c:otherwise>
							<div class="sum_over">
								<p class="sum_Member">
									<span class="color_red">
										该套餐已下架
									</span>
								</p>
							</div>
						</c:otherwise>
						</c:choose>
		    			<div class="parts-category">
		    				<ul class="parts-category-wrap">
		    				<c:forEach items="${webGoodsCombDetails }" var="goodsCombDetail">
		    					<li class="item col-xs-12" style="text-align: left;padding-left:5px">
			    					<a href="javascript:;" onclick="detailFunc('${goodsCombDetail.goodsCombId}','${goodsCombDetail.goodsCode}','${firstStore.code}')">
				    					<td><span class="col-xs-5" style="margin-right: 1px;padding:0px 5px;">配件编号(${goodsCombDetail.partsCode })</span></td>
				    					<td><span class="col-xs-5" style="margin-right: 1px;padding:0px 5px;">${goodsCombDetail.goodsName }</span></td>
				    					<td><span class="col-xs-1" style="margin-right: 1px;padding:0px 5px;">x${goodsCombDetail.num }</span></td>
			    					</a>
		    					</li>
		    				</c:forEach>
		    				</ul>
		    			</div>
		    			<c:choose>
						<c:when test="${WebGoodsComb.status==1}">
		    			<div class="jion_btn">
		    				<a href="${ctxWeb }/goodsComb/toGoodsComboOrder?id=${WebGoodsComb.id}" class="enter_shopping">立即购买</a>
		    			</div>
		    			</c:when>
		    			</c:choose>
					</div>
					<!--右边结束-->
				</div>
			</div>
		</div>
	</div>
	<!--pc商品详情结束-->
	<!--商品详情列表-->
	<div class="goods_list_box">
		<div class="container">
			<div class="row">
				<div class="col-sm-12 pad0">
					<div class="goods_tab_box">
						<div class="goods_tab_title">
							<ul class="clearfix">
								<li><a href="javascript:void(0)">商品详情</a></li>
							</ul>
						</div>
						<div class="goods_tab_list">
							<div class="goods_tab_item">
								<div class="package-pic-w">
									<c:forEach items="${WebGoodsComb.detailImageList}" var="detailImg">
										<img src="${ctxWeb}/web/file/getFile?filePath=${detailImg}" alt="" />
									</c:forEach>
								</div>
								<!--viedo-->
								<!-- <video width="100%" controls="controls">
						  			<source src="images/movie.ogg" type="video/ogg">
						  			<source src="images/video.mp4" type="video/mp4">
								</video> -->
								<!--video结束-->
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	<!--商品详情列表切换-->
	<!--手机端购物车-->
	<div class="fix_bootom_box">
		<figure class="fix_shop">
			<a href="${ctxWeb }/goodsComb/toGoodsComboOrder?id=${WebGoodsComb.id}">立即购买</a>
		</figure>
	</div>
	<!--手机端购物车结束-->
</body>
</html>